import React, { Component } from 'react'
import {connect} from "react-redux"
import {bindActionCreators} from "redux"
import * as action from "../action/index.js"
 class Home extends Component {
  componentDidMount(){
      this.props.getList()
  }
  goDetail(item){
    this.props.history.push({
        pathname:"/detail",
        state:{
            item
        }
    })
  }
  render() {
    console.log(this.props);
    return (
      <div>
          {
              this.props.arr&&this.props.arr.length?this.props.arr.map((item,index)=>{
                  return <div key={index} onClick={this.goDetail.bind(this,item)}>
                      <img src={item.img} alt="" />
                      <h3>{item.title}</h3>
                  </div>
              }):""
          }
      </div>
    )
  }
}
let mapStateToProps = (state)=>{
    return {
        ...state.shopReducer
    }
}
let mapDispatchToprops = (dispatch)=>bindActionCreators(action,dispatch)
export default connect(mapStateToProps,mapDispatchToprops)(Home)